# Static Content

## Examples


### Basic

Static Content renders content within a Control Group.

```typescript
import React from 'react';

import ControlGroup from '@splunk/react-ui/ControlGroup';
import StaticContent from '@splunk/react-ui/StaticContent';


function Basic() {
    return (
        <ControlGroup label="StaticContent" controlsLayout="fill">
            <StaticContent> This simply renders the child text! </StaticContent>
        </ControlGroup>
    );
}

export default Basic;
```



### Icons and Other Controls

Static Content with other components in a Control Group.

```typescript
import React from 'react';

import CylinderMulti from '@splunk/react-icons/CylinderMulti';
import File from '@splunk/react-icons/File';
import ControlGroup from '@splunk/react-ui/ControlGroup';
import StaticContent from '@splunk/react-ui/StaticContent';
import Text from '@splunk/react-ui/Text';


function FieldValue() {
    return (
        <div>
            <ControlGroup label="Product">
                <StaticContent inline>
                    <File />
                </StaticContent>
                <StaticContent inline>
                    <CylinderMulti />
                </StaticContent>
            </ControlGroup>

            <ControlGroup label="Cost" controlsLayout="none">
                <Text defaultValue="20" inline />
                <StaticContent inline>Dollars or less</StaticContent>
            </ControlGroup>
        </div>
    );
}

export default FieldValue;
```




## API


### StaticContent API

This component is intended for use in a control group, either to display a static value or
between two controls.

#### Props

| Name | Type | Required | Default | Description |
|------|------|------|------|------|
| children | React.ReactNode | no |  |  |
| elementRef | React.Ref<HTMLDivElement> | no |  | A React ref which is set to the DOM element when the component mounts, and null when it unmounts. |
| inline | boolean | no | false | When true, display as inline-block with auto width. |
| labelledBy | string | no |  |  |





